/*
* @Author: sam
* @Date:   2017-10-12 10:56:19
* @Last Modified by:   sam
* @Last Modified time: 2017-10-27 17:44:05
*/
(function(win){
	var ListBox = function(opts){
		this.mapType = 'baidu';
		this.searchInput = 'listSearch';
		this.init.call(this,opts);
	};
	ListBox.prototype = {
		init : function(opts){//初始化
			this.id = opts.id;
			this.dom = document.getElementById(this.id);
			this.members = [];
			this.titles = [];
			this.clientHeight = window.screen.height - (document.querySelector('.searchBox') === null ? 0 : document.querySelector('.searchBox').offsetHeight) - (window.screen.height - window.innerHeight);//可是区域高度
			this.touchEvent = {};
			this.top = 0;
			this.MaxTop = 0;
			this.MinTop = 30;
			this.tag = true;
			this.timer = 300;
			this.canPullUp = true;
			this.canPullDown = true;
			this.PullUpFun = opts.PullUpFun;
			this.PullDownFun = opts.PullDownFun;
			this.searchFun = opts.searchFun;
			if(document.querySelector('.searchBox') !== null){
				this.initTouchBox();
			}
			return this;
		},
		initTouchBox : function(){
			var that = this;
			this.touchBox = document.createElement('div');
			this.touchBox.className = "listTouchBox touchStop";
			this.dom.appendChild(this.touchBox);
			this.dom.style.height = this.clientHeight + "px";

			this.pullUpDom = document.createElement('div');
			this.pullUpDom.className = 'pullUp';
			this.pullUpDom.innerHTML = "上拉加载...";

			this.pullDownDom = document.createElement('div');
			this.pullDownDom.className = 'pullDown';
			this.pullDownDom.innerHTML = "下拉刷新";

			this.dom.addEventListener('touchstart',function(e){
				if(that.tag){
					if(that.touchBox.classList.contains('touchStop')){
						that.touchBox.classList.remove('touchStop');
					}
					that.touchEvent.sX = e.touches[0].clientX;
					that.touchEvent.sY = e.touches[0].clientY;
				}
			},false);

			this.dom.addEventListener('touchmove',function(e){
				e.preventDefault();
				if(that.tag){
					that.touchEvent.mX = e.touches[0].clientX;
					that.touchEvent.mY = e.touches[0].clientY;
					if(that.touchEvent.sX !== undefined && that.touchEvent.sY !== undefined && that.touchEvent.mY !== undefined && that.touchEvent.mY !== undefined){
						that.touchMoveFun();
					}
				}
			},false);

			this.dom.addEventListener('touchend',function(e){
				if(that.tag){
					that.touchEvent.eX = e.changedTouches[0].clientX;
					that.touchEvent.eY = e.changedTouches[0].clientY;
					if(that.touchEvent.sX !== undefined && that.touchEvent.sY !== undefined && that.touchEvent.mY !== undefined && that.touchEvent.mY !== undefined && that.touchEvent.eX !== undefined && that.touchEvent.eY !== undefined){
						that.touchEndFun();
					}
				}
			},false);
		},
		touchMoveFun : function(){
			if(this.touchEvent.sY > this.touchEvent.mY){//上拉加载
				this.top = this.top - Math.abs(this.touchEvent.sY - this.touchEvent.mY);
				if(this.top < this.MaxTop){
					this.top = this.MaxTop - this.MinTop;
					this.touchBox.appendChild(this.pullUpDom);//添加载入中容器
				}
				//this.touchBox.style.top = this.top + "px";
			}else{//下拉
				this.top = this.top + Math.abs(this.touchEvent.sY - this.touchEvent.mY);
				if(this.top > this.MinTop){
					this.top = this.MinTop;
					this.touchBox.insertBefore(this.pullDownDom,this.touchBox.firstChild);
				}
			}
			this.touchEvent.sY = this.touchEvent.mY;
			this.touchBox.style.top = this.top + "px";
			//console.log(this);
		},
		touchEndFun : function(){
			var that = this;
			this.touchEvent = {};
			this.tag = false;
			if(!this.touchBox.classList.contains('touchStop')){
				this.touchBox.classList.add('touchStop');
			}

			//下拉刷新
			if(this.top >= this.MinTop){
				this.top = 0;
				window.setTimeout(function(){
					while(that.members.length > 0){
						that.touchBox.removeChild(that.members.pop());
					}
					if(that.canPullUp === false){//把加载全部的节点删除
						if(that.touchBox.querySelector('.pullUp') !== null){
							that.touchBox.removeChild(that.pullUpDom);
							that.canPullUp = true;
						}
					}
					that.touchBox.removeChild(that.pullDownDom);
					that.PullDownFun();
				},(this.timer - 100));
			}

			//上拉加载
			if(this.top <= this.MaxTop - this.MinTop){
				this.top = this.MaxTop;
				window.setTimeout(function(){
					if(that.canPullUp === true){
						that.touchBox.removeChild(that.pullUpDom);
						that.PullUpFun();
					}
				},(this.timer - 100));
			}
			window.setTimeout(function(){
				that.touchBox.style.top = that.top + "px";
				that.tag = true;
			},this.timer);
		},
		countHeight : function(){
			this.boxHeight = this.touchBox.offsetHeight;//当期容器高度
			this.MaxTop = (this.boxHeight < this.clientHeight) ? 0 : this.clientHeight - this.boxHeight;
		},
		rendHtml : function(data){
			var container,_html = "";
			if(data.length > 0){
				// if(this.members.length > 0){
				// 	this.titles = [];
				// 	while(this.members.length > 0){
				// 		this.dom.removeChild(this.members.shift());
				// 	}
				// }

				for(var i = 0; i<data.length ; i++){
					container = document.createElement('div');
					container.className = 'listBox';
					_html = '<div class="textBox">' +
								'<span class="areaName">' + data[i]['areaName'] + '</span>' +
								'<span class="starBox">' + getStar(data[i]['star']) +
								'</span>' +
								'<a class="goDeatil fr" href="' + data[i]['detailUrl'] + '">' +
									'详情<span class="iconfont icon-jiantou"></span>' +
								'</a>' +
							'</div>' +
							'<div class="imgBox">' +
								'<img src="' + data[i]['img'] + '">' +
							'</div>' +
							'<div class="textBox bordBom">' +
								'<a href="javascript:;" onclick="makeCall(this)" tel="' + data[i]['contactTel'] + '">' +
									'<span class="iconfont icon-yonghu"></span>联系人 : <span class="contentPerson">' + data[i]['contactName'] + ' ' + data[i]['contactTel'] + '</span>' +
									'<span class="iconfont icon-dianhua-copy-copy-copy-copy fr"></span>' +
								'</a>' +
							'</div>' +
							'<div class="textBox baiduTraffic">' +
								'<a href="javascript:;" onclick="openApp(this)" lng="' + data[i]['lng'] + '" lat="' + data[i]['lat'] + '" dest_name="' + data[i]['address'] + '">' +
									'<span class="iconfont icon-dizhi"></span>' + data[i]['address'] + 
									'<span class="iconfont icon-22dh fr"></span>' +
								'</a>' +
							'</div>';
					container.innerHTML = _html;
					this.members.push(container);
					this.titles.push(data[i]['areaName']);
					this.touchBox.appendChild(container);
				}
			}
			this.countHeight();
			this.bindInput();

			//获得五角星的html
			function getStar(num){
				var _html = "";
				for(var i = 0; i < num; i++){
					_html += '<span class="iconfont icon-wujiaoxing"></span>';
				}
				return _html;
			}

		},
		bindInput : function(){
			var that = this;
			this.input = document.getElementById(this.searchInput);
			if(this.input.onchange === null){
				this.input.onchange = function(e){
					while(that.members.length > 0){
						that.touchBox.removeChild(that.members.pop());
					}
					if(that.canPullUp === false){//把加载全部的节点删除
						if(that.touchBox.querySelector('.pullUp') !== null){
							that.touchBox.removeChild(that.pullUpDom);
						}
					}
					if(that.touchBox.querySelector('.pullDown') !== null){
						that.touchBox.removeChild(that.pullDownDom);
					}
					that.changePullUp(true);
					that.top = 0;
					that.touchBox.style.top = that.top + "px";
					that.searchFun();
					//that.showFillData(e.target.value);
				};
			}
		},
		showFillData : function(value){
			if(value === ""){
				for(var i = 0; i< this.members.length; i++){
					this.members[i].style.display = 'block';
				}
			}else{
				for(var i = 0; i< this.titles.length; i++){
					if(new RegExp(value).test(this.titles[i])){
						this.members[i].style.display = 'block';
					}else{
						this.members[i].style.display = 'none';
					}
				}
			}
		},
		changeMapType : function(type){
			this.mapType = type;
		},
		openMapApp : function(dest){
			var geoData = Utils.getGeoLocalData(this.mapType);
			var url,transfer;
			geoData.dest_name = dest.dest_name;
			geoData.dest_lng = dest.lng;
			geoData.dest_lat = dest.lat;
			if(this.mapType === 'baidu'){
				url = Utils.getTrafficUrl(geoData,this.mapType);
				console.log(url);
				window.location.href = url;
			}
			if(this.mapType === 'gaode'){
				url = Utils.getTrafficUrl(geoData,this.mapType);
				console.log(url);
				window.location.href = url;
			}
		},
		changePullUp : function(boolean){
			this.canPullUp = boolean;
			if(boolean === false){
				this.pullUpDom.innerHTML = "无更多数据";
				this.touchBox.appendChild(this.pullUpDom);//添加载入中容器
			}else{
				this.pullUpDom.innerHTML = "上拉加载...";
			}
		}
	};
	win.Class = win.Class || {};
	win.Class.ListBox = ListBox;
})(window);